select 태그

✒️ 2025-05-16 11:12 내용 수정

참고 자료 : TCPSchool HTML 태그 select, TCPSchool HTML 태그 option

옵션 메뉴를 제공하는 드롭다운 리스트를 생성한다.
select 태그 안에 option 태그로 옵션 메뉴를 정의한다.
상세 활용은 Sequelize로 CRUD 수행하기 (Rest Client)#기타 설정에서 사용했다.

태그	속성	설명
`<select>`		드롭다운 리스트 생성
	`name`	name 속성값
	`id`	id 속성값
	`size="숫자"`	select 드롭다운 메뉴에서 보여줄 개수를 설정
	`multiple`	두 개 이상의 옵션 선택 가능. Window에선 CTRL이나 SHIFT, Mac에선 COMMAND키로 선택 가능
	`autofocus`	페이지가 로드되면 자동으로 포커스가 드롭다운 리스트로 이동됨
	`disabled`	해당 옵션이 비활성화되어 선택할 수 없음
`<option>`		옵션 하나를 지정
	`value`	옵션 항목의 값. content에 기재한 내용이 보이고, value에 기재한 내용은 보이지 않음. 해당 옵션이 선택되면 value에 입력한 값이 서버로 전송됨
	`selected`	특정 옵션을 선택한 상태로 유지(select 태그에 이 옵션 내용이 뜸)
	`disabled`	해당 옵션이 비활성화되어 선택할 수 없음
`<optgroup>`		옵션들의 그룹을 정의

<select>
    <option value="1번">1</option>
    <option value="2번">2</option>
    <option value="3번">3</option>
    <option value="4번">4</option>
</select>

select option.png